import React, { Component } from 'react';
import '../view/Favor.scss'
import { NavBar, Space, Toast } from 'antd-mobile'
import { good_favlist } from '../utils/api'
import '../view/Favor.scss'
import Item from 'antd-mobile/es/components/dropdown/item';
import { good_unfavor } from '../utils/api'
import store from '../store/index.js'
// 导入store


class Favor extends Component {
    constructor(props) {
        super(props);
        this.state = {
            favorlist: []
        }
    }
    back = () => {
        this.props.history.go(-1);
    }
    componentDidMount() {
        var userid = JSON.parse(localStorage.getItem("userInfo")).id

        this.setState({
            // favorlist: store.getState().user_favor_list
        })
        // good_favlist({ userid }).then((res) => {
        //     this.setState({
        //         favorlist: res.data.list
        //     }, localStorage.setItem("favorlist", JSON.stringify(res.data.list))
        //     )
        // })

        // 监听store中的数据，一旦store中的数据发生改变，自动触发subscribe中的回调函数（在这里可以获取最新的store中的数据，可以触发组件更新）
        store.subscribe(() => {
            console.log(store.getState())
            this.setState({})
        })
    }
    handleclickUnfavor(item, index) {
        var userid = JSON.parse(localStorage.getItem("userInfo")).id
        var goodid = item.id;
        console.log(userid, goodid)

        good_unfavor({ userid, goodid }).then((res) => {
            console.log(res.data)
        })
        store.dispatch({ type: "STORE_FAVOR_LIST_SUB", payload: item })
    }
    todetails(item) {
        this.props.history.push({ pathname: '/details', state: { id: item.id } })
    }

    render() {
        return (
            <div className='favor'>
                <NavBar onBack={this.back} onClick={() => {

                }}>收藏页</NavBar>
                <div className='allfavors'>
                    {
                        store.getState().user_favor_list.map((item, index) => {
                            return (
                                <div className='good' key={index}>
                                    <div className='imgbox'>
                                        <img src={item.pic} alt="" />
                                    </div>
                                    <div className="info">
                                        <div className="name" onClick={() => {
                                            this.todetails(item)
                                        }}
                                        >{item.name}</div>
                                        <div className="price_cancle">
                                            <span className='price'>
                                                活动价<span className="price">￥{parseInt(item.salesPrice && item.salesPrice.value)}</span>
                                            </span>
                                            <span className="cancle" onClick={() => {
                                                this.handleclickUnfavor(item, index)
                                            }}>取消收藏</span>
                                        </div>
                                    </div>
                                </div>
                            )
                        })
                    }
                </div>
                <div className="empty" style={{ display: (store.getState().user_favor_list.length == 0 ? "block" : "none") }}>
                    还没有收藏任何物品哦，去<span onClick={() => {
                        this.props.history.push("/index/allgoods")
                    }}>逛逛</span>吧~
                </div>
            </div>
        );
    }
}

export default Favor;